<template>
	<view>
		<view class="more" v-for="(item,index) in contentList" :key="index">
			<view class="more-box-con-active" v-if="item.type == 'text'">
				<view class="more-content" @click="goSet(item.id)">
					<view class="more-text">
						<text>{{item.text}}</text>
					</view>
					<view class="more-img">
						<view class="text">
							<text>{{handlerData(item.id) != null ? handlerData(item.id):''}}</text>
						</view>
						<view class="img">
							<image src="@/static/img/common/goMore.svg"></image>
						</view>
					</view>

				</view>
			</view>
			<!-- <view class="more-box-con" v-if="item.type == 'switch'">
				<view class="more-content">
					<view class="more-text">
						<text>{{item.text}}</text>
					</view>
					<view class="more-switch">
						<switch :checked="item.chatIsSwitch" color="#108EE9" style="transform: scale(0.6)"
							@change="switchChange(item.id)" />
					</view>
				</view>
			</view> -->
			<view class="more-hr" v-if="item.isShowZw"></view>
		</view>

		<view class="more">
			<view class="more-hr"></view>
			<view class="more-box-con">
				<view class="more-content">
					<view class="more-text">
						<text>{{goTopData.text}}</text>
					</view>
					<view class="more-switch">
						<switch :checked="goTopData.chatIsSwitch" color="#108EE9" style="transform: scale(0.6)"
							@change="switchChange(goTopData.id)" />
					</view>
				</view>
			</view>

			<view class="more-box-con">
				<view class="more-content">
					<view class="more-text">
						<text>{{goMsgData.text}}</text>
					</view>
					<view class="more-switch">
						<switch :checked="goMsgData.chatIsSwitch" color="#108EE9" style="transform: scale(0.6)"
							@change="switchChange(goMsgData.id)" />
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations,
		mapActions
	} from 'vuex'

	import {
		addMsgDisturbData,
	} from '@/object/msg.js'

	import {
		setContentData,
		goTopData,
		goMsgData
	} from '../set-group.js'

	export default {
		props: ['username', 'chatObject', 'iInGroupRemarks'],
		data() {
			return {
				contentList: [],
				isShowBottom: false,
				title: '昵称',
				goTopData: goTopData,
				goMsgData: goMsgData
			}
		},
		computed: {
			...mapState('m_chat', ['topUserData', 'notDisturbUserData']),
		},
		methods: {
			...mapActions('m_chat', ['msgGoTop', 'clearMsgByList', 'addChatData', 'clearLocalMsgList',
				'addDisturbUserList'
			]),

			handlerData(id) {
				if (id == 1) {
					return this.username
				} else if (id == 3) {
					return this.iInGroupRemarks
				} else if (id == 4) {
					return false
				} else if (id == 5) {
					return false
				} else {
					return null
				}
			},

			//1，获取switch状态
			getSwitchState() {
				//聊天置顶
				this.goTopData.chatIsSwitch = this.chatObject.isTop
				//消息免打扰
				this.goMsgData.chatIsSwitch = this.chatObject.isDisturb
			},
			//2，点击switch按钮
			switchChange(id) {
				//console.log(id)
				if (id == 5) {
					//置顶聊天
					this.msgGoTop(this.chatObject)
					this.$emit('msgGoTop')
				} else {
					// 消息免打扰
					this.addDisturbUserList(this.chatObject)
					this.$emit('disturbUser')
				}
			},
			//改变msgObject 数据
			changeChatObject(changeChatObject) {
				this.$emit('changeChatObject', changeChatObject)
			},
			//3,去设置
			goSet(id) {
				if (id == 6) {
					//清空聊天记录
					return this.clearMsgList()
				} else if (id == 7) {
					//跳转投诉页面
					//投诉
					return uni.navigateTo({
						url: '/subpkg/msg/set/report/report'
					})
				} else if (id == 2) {
					//跳转家族管理页面
					if (this.chatObject.identity != '1' && this.chatObject.identity != '2') {
						return uni.$showMsg('您没有管理员权限！');
					}
					return uni.navigateTo({
						url: '/subpkg/msg/set/set-group/set-group-admin/set-group-admin?groupId=' +
							this.chatObject.id
					})
				} else if (id == 3) {
					this.$emit('showChangeNickname')
				}

			},
			//3.1，清空聊天记录
			async clearMsgList() {
				var that = this
				uni.$isShowModal('清空聊天记录将无法恢复！').then(resultState => {
					if (resultState) {
						that.clearLocalMsgList(that.chatObject)
						
						return uni.$showMsg('消息已被清空！');
					}
				})
			
			},
			//4，关闭弹框
			display() {
				this.isShowBottom = false
			}
		},
		mounted() {
			//this.queryMsgDisturb()

			this.contentList = setContentData

			this.getSwitchState()
		}
	}
</script>

<style scoped lang="scss">
	.more {
		width: 100%;
		background-color: #fff;
	}

	.more-box-con-active {
		width: 100%;

		&:active {
			background-color: #f3f3f3;
		}
	}

	.more-content {
		display: flex;
		width: 94%;
		margin-left: 3%;
		justify-content: space-between;
		height: 80rpx;
		line-height: 80rpx;

		.more-text {
			font-size: 28rpx;
		}

		.more-img {
			display: flex;
			height: 80rpx;

			text {
				line-height: 80rpx;
				font-size: 28rpx;
			}

			image {
				width: 50rpx;
				height: 50rpx;
				margin-top: 15rpx;
				margin-right: 20rpx;
			}

		}
	}

	.more-hr {
		// border-bottom: 10rpx solid rgba(229, 229, 229, 1);
		width: 100%;
		height: 20rpx;
		background: rgba(229, 229, 229, 1);
	}
</style>